<template>
	<div class="page page-voice-detail has-headbar">
		<head-bar
			:title="$route.meta.title"
			:prevRoute="{name: 'voice-list'}"
		/>
		<van-cell-group>
			<van-field
				v-model="content"
				type="textarea"
				class="textarea"
				placeholder="写出您的心声..."
				rows="8"
			/>
		</van-cell-group>
		<div class="btn-submit">
			<van-button class="button" @click="submitEvent" type="primary" :disabled="loading" :loading="loading">提交</van-button>
		</div>
	</div>
</template>

<script>
import { API_CITIZEN_COMMENT_POST } from '@/service/voice'
export default {
  name: 'voice-form',
  data () {
    return {
      content: '',
      loading: false
    }
  },
  methods: {
    submitEvent () {
      if (!this.content) {
        this.$toast('请输入内容')
        return
      }
      this.loading = true
      API_CITIZEN_COMMENT_POST({ content: this.content }).then(resData => {
        this.$toast('发表成功')
        this.$router.replace({ name: 'voice-list' })
      }).catch(() => {
        this.loading = false
      })
    }
  }
}
</script>

<style scoped lang="less">
	@import "./../../assets/styles/user.less";
	/deep/ .van-cell{padding:20px;}
	.btn-submit{
		padding:20px;
		.button{height:80px/2;background-color:#fea54b;color:#fff;font-size:30px/2;border:none;display:block;width:100%;-webkit-border-radius:10px/2;-moz-border-radius:10px/2;border-radius:10px/2;}
	}
</style>
